:root {
    --primary-color: #23517a;
    --secondary-color: #23517a;
}

.chatbox {
    color: var(--secondary-color);
}

.chatbox__body::before {
    background: #eaecf0;
}
.chatbox input.form-control {
    color: #000;
}

.chatbox input.form-control:focus {
    border-color: #000;
}

.chatbox__head {
    background: var(--primary-color);
}
.chatbox .chatbox_sub_name {
    color: #fff;
}
.chatbox .btn.btn-upload-close,
.chatbox .btn.btn-report-close,
.chatbox .btn.btn-register-close {
    color: #000;
}

.btn-drop {
    border-radius: 50%;
    border: none;
    display: flex;
    place-items: center;
    background-color: transparent;
    cursor: pointer;
}

.btn-drop > svg {
    border-radius: inherit;
    padding: 0.5rem;
    fill: #fff;
    /* SVG color */
    width: 38px;
    /* default width 32px */
    height: 38px;
    /* default height 32px */
}

.btn-drop > svg:active {
    background-color: rgba(65, 65, 65, 0.5);
}

.btn-drop > svg:not(:active) {
    animation: fadeOut 0.9s;
}

@keyframes fadeOut {
    0% {
        outline: 1px solid rgba(90, 90, 90, 0.5);
        /* If you use border it will take space inside and slightly move the SVG */
    }

    100% {
        background-color: transparent;
    }
}

.chatbox .btn.btn-upload-close:hover,
.chatbox .btn.btn-report-close:hover,
.chatbox .btn.btn-register-close:hover {
    background: #000;
    color: #fff;
}

.chatbox__upload-image--body .custom-file-label {
    background-color: #000;
}

.chatbox .btn-clean.closeChatbox:hover rect,
.chatbox .btn-clean.showDropdown:hover path {
    fill: #494b74;
}

.report-choices > input:checked ~ .custom-radio {
    border-color: #000;
}

.report-choices > .custom-radio:after {
    border: solid #000;
    background: #000;
}

.chatbox .chatbox-nav__head {
    background: #000;
}
.chatbox .chatbox-nav__item {
    color: #9d9fa9;
}
.chatbox .chatbox-nav__item:hover {
    color: #3f434a;
    background: rgba(229, 234, 240, 0.47);
}
.chatbox .chatbox-nav__item svg path {
    fill: #8a9099;
}
.chatbox .chatbox-nav__item:hover svg path {
    fill: #3f434a;
}

.simplebar-scrollbar::before {
    background: #000;
}

.chatbox .chatbox__foot {
    background: #fcfcfd;
}
.chatbox__foot .chatbox__reply {
    color: white;
    padding: 0.7em 0.7em;

    display: flex;
    align-items: center;
    border: none;
    border-radius: 4px;
    overflow: hidden;
    transition: all 0.2s;
    cursor: pointer;
    background: var(--primary-color);
}
#submitButton {
    border: 0;
}
.chatbox .chatbox__typing span {
    background-color: #000;
}
.chatbox .chatbox__editor input::placeholder {
    color: #72777a99;
}

.chatbox__message .chatbox__text,
.chatbox .chatbox__message .chatbox__datetime {
    color: black !important;
}

.chatbox__options .chatbox__options--btn,
.chatbox__options .register__option {
    color: #000;
    border: 1px solid #494b74;
}

.chatbox .chatbox__editor input {
    color: #000;
}

.chatbox .chatbox__actions .chatbox__reply,
.chatbox .chatbox__upload-image--body .chatbox__reply {
    background-color: #000;
    border-color: #000;
}

.chatbox__actions .chatbox__reply path {
    fill: #000;
}

.chatbox__actions .chatbox__reply:hover path {
    fill: #000;
}

.chatbox .chatbox__upload-image--body .chatbox__reply:hover {
    background-color: #333;
    border-color: #333;
}

.chatbox .color-schema-container svg path {
    fill: #000;
}
